<?php
	require ('api/config.php');
?>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="Robots" content="All" />
		<meta http-equiv="windows-Target" content="_top" />
		<meta http-equiv='content-language' content='zh-CN'>
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<link rel="stylesheet" type="text/css" href="style/css/logon.css"/>
		<script src="style/vue/vue.global.js" type="text/javascript" charset="utf-8"></script>
		<script src="style/vue/axios.min.js" type="text/javascript" charset="utf-8"></script>
		<title>Login | TOP图片收集管理系统</title>
	</head>
	<body>
	<div id="app">
		<div class="top" style="background-color: #666;padding-left:20px;">
			<h4 class="title"> TOP图片收集管理系统 | Login</h4>
		</div>
		<div class="main">
			<div class="main-left">
				<h4>TOP图片收集管理系统</h4>
				<li>美好的事情即将发生</li>
				<li>去到想去的远方</li>
				<li>见到想见到的人</li>
				<li>梦和远方都可以去追逐</li>
				<li>始于2019仲夏</li>
				<li><tt>2024 仲夏</tt></li>
			</div>
			<div class="main-right">
				<li class="main-title">用户登录 (通用)</li>
				<form action="?" method="post">
					<li><input type="text" v-model="username" placeholder="用户名 / QQ号" maxlength="15"/></li>
					<li><input type="password" v-model="password" placeholder="密 码 (长度6位以上)" maxlength="15"/></li>
					<li><input type="button" value="登录" @click="logonrun()" id="run"/></li>
				</form>
				<div class="main-right-a">
					<a href="login/index.php" target="_top" class="login-a">没有账号,去注册</a>
				</div>
				<div class="again">登录代表我已阅读并同意<a href="admin/agree.html" target="_blank">《用户使用协议》</a></div>
			</div>
		</div>
		<div class="bottom">
			<tt>Opyright © 2024 TOP图片收集管理系统 All Rights Reservedby.</tt>
		</div>
	</div>
	</body>
	<script type="text/javascript" charset="utf-8">
	const App = {
        data() {
        return{
            username:'',qqnum:'',email:'',password:'',conpassword:'',ver:'',verimg:''
        }
    },
    methods: {
        logonrun:function(){
            if(!this.username){ alert('请输入用户名！');
            }else if(!this.password){ alert('请输入密码！');
            }else if(this.username.length <2 || this.username.length >10){ alert('你输入的用户名不合法！（2~10位）');
            }else{
                var that = this;
                axios.post("api/login.php",{
                    username:this.username,password:this.password
                }).then(function(resp) {
                    var data = resp.data;
                    if(data.state == '200'){
                        alert('欢迎回来，'+that.username);
						window.location.href="../";
                    }else if(data.state=='400'||data.stats=='error'){ 
						alert(data.msg);
                    }else{
						alert('登录时发生错误，请联系管理员处理');
					}
                    that.password = '';
                });
            }
        }
	},
    mounted:function(){
        
    },created(){
        <?php
            if($username){ echo 'alert("'.$username.'，您已登录账号");window.location.href="../";'; }
        ?>
     }
     }
     Vue.createApp(App).mount('#app')
	</script>
</html>
